<template>
  <tl-sub-page :render="render" :visible.sync="visible" v-dialogDrag :title="title" :close-on-click-modal="false" class="tl-dialog" width="800px" @open="open" @close="close">
    <el-row v-if="fromApproval === '1'">
      <el-col :span="24">
        <el-button type="danger" style="float: right" size="small" icon="el-icon-close" circle @click="doCancelEdit"></el-button>
      </el-col>
    </el-row>
    <br>
    <el-form class="tl-form" ref="form" :model="model" :rules="rules" label-width="150px">
      <el-row>
        <el-col :span="24">
          <el-form-item label="任务名称" prop="taskname">
            <el-input v-model="model.taskname" type="text" :disabled="true"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="任务内容" prop="taskdetail">
            <el-input v-model="model.taskdetail" type="textarea" :autosize="{ minRows:1, maxRows:3 }" :disabled="true"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="更新内容" prop="taskfeedbackdetail" :rules="rules.validateRequire">
            <el-input v-model="model.taskfeedbackdetail" type="textarea" :rows="4" maxlength="1000">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="任务进度" prop="taskschedule" :rules="rules.validateRequire">
            <el-input-number v-model="model.taskschedule" controls-position="right" :step="1" :min="0" :max="100" style="width:93%" @change="changetaskschedule"></el-input-number><span>%</span>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="任务风险" prop="taskrisk" >
            <el-select v-model="model.taskrisk" :class="taskRiskClassName" clearable>
              <el-option v-for="item in codeModel.taskriskList" :key="item.code" :label="item.name" :value="item.code"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12" v-if="isDmdTask === 1">
          <el-form-item label="是否获取决策链名单" prop="havenamelist" :rules="isFinish ? rules.validateRequire : []">
            <el-select v-model="model.havenamelist" @change="changehavenamelist" clearable>
              <el-option v-for="item in codeModel.enabledList" :key="item.code" :label="item.name" :value="item.code"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="isDmdTask === 2">
          <el-form-item label="供应商绩效评价得分" prop="guoscore" :rules="isFinish ? rules.validateRequire : []">
            <el-input v-model="model.guoscore"> </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="isDmdTask === 2">
          <el-form-item label="供应商绩效评价排名" prop="guorank" :rules="isFinish ? rules.validateRequire : []">
            <el-input v-model="model.guorank"> </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="isDmdTask === 2">
          <el-form-item label="供应商绩效评价档位" prop="guoposition" :rules="isFinish ? rules.validateRequire : []">
            <el-input v-model="model.guoposition"> </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24"  v-if="isDmdTask === 3">
          <el-row :gutter="8">
            <el-col :span="23" v-if="isDmdTask === 3">
              <el-form-item label="已获取审查会文件内容" prop="documentDetail" label-width="160px">
                <el-select v-model="documentDetail" placeholder="请选择" filterable multiple clearable @change="changeReviewMeetingDocument">
                  <el-option v-for="item in codeModel.reviewmeetingdocumentList" :key="item.code" :label="item.name" :value="item.code"> </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="1" v-if="isDmdTask === 3">
              <el-tooltip content="要求必须获取资格要求、技术规范、分标分包、限价、评分细则。" placement="top" style="font-size:20px; margin-top:4px">
                <i class="el-icon-info" style="color: #909399"/>
              </el-tooltip>
            </el-col>
          </el-row>
        </el-col>
        <el-col :span="12" v-if="isDmdTask === 3">
          <el-form-item label="是否已获取审查会决策链名单" prop="reviewmeetname" :rules="rules.validateRequire" label-width="210px">
            <el-select v-model="model.reviewmeetname">
              <el-option v-for="item in codeModel.enabledList" :key="item.code" :label="item.name" :value="item.code"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="isDmdTask === 4">
          <el-form-item label="履约评价得分" prop="nankeepscore" :rules="isFinish ? rules.validateRequire : []">
            <el-input v-model="model.nankeepscore"/>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="isDmdTask === 4">
          <el-form-item label="履约评价排名" prop="nankeeprank" :rules="isFinish ? rules.validateRequire : []">
            <el-input v-model="model.nankeeprank"/>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="isDmdTask === 4">
          <el-form-item label="运行评价得分" prop="nanmovescore" :rules="isFinish ? rules.validateRequire : []">
            <el-input v-model="model.nanmovescore"/>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="isDmdTask === 4">
          <el-form-item label="运行评价排名" prop="nanmoverank" :rules="isFinish ? rules.validateRequire : []">
            <el-input v-model="model.nanmoverank"/>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="isFinish">
          <el-form-item label="实际完成日期" prop="taskactualenddate" :rules="rules.validateRequire">
            <el-date-picker v-model="model.taskactualenddate" type="date" placeholder="例：2021-01-01" value-format="yyyy-MM-dd" @change="taskactualenddate" :picker-options="pickerOptions"></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="isFinish">
          <el-form-item label="任务是否完成" prop="istaskcomplete" :rules="rules.validateRequire">
            <el-select v-model="model.istaskcomplete" @change="changeistaskcomplete" clearable :disabled="model.havenamelist === '0'|| documentTaskUnfinish">
              <el-option v-for="item in codeModel.istaskcompleteList" :key="item.code" :label="item.name" :value="item.code"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="更新日期" prop="feedbackdate">
            <el-date-picker v-model="model.feedbackdate" type="date" placeholder="更新日期" value-format="yyyy-MM-dd" :disabled="true">
            </el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="更新人姓名" prop="username">
            <el-input v-model="model.username" :disabled="true"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="更新人工号" prop="usercode">
            <el-input v-model="model.usercode" :disabled="true"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="计划开始日期" prop="planstartdate">
            <el-date-picker v-model="model.planstartdate" type="date" placeholder="例：2021-01-01" value-format="yyyy-MM-dd" :disabled="true"></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="计划完成日期" prop="planenddate">
            <el-date-picker v-model="model.planenddate" type="date" placeholder="例：2021-01-01" value-format="yyyy-MM-dd" :disabled="true"></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="任务派发日期" prop="taskdistributedate">
            <el-date-picker v-model="model.taskdistributedate" type="date" placeholder="例：2021-01-01" value-format="yyyy-MM-dd" :disabled="true"></el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row v-if="model.customerattach">
        <el-col :span="24">
          <el-form-item label="客户接触现状" prop="customerattach" >
            <el-input v-model="model.customerattach" type="textarea" :autosize="{ minRows:1, maxRows:3 }"  :disabled="true"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row v-if="model.improveplan">
        <el-col :span="24">
          <el-form-item label="客户关系改善计划" prop="improveplan">
            <el-input v-model="model.improveplan" type="textarea" :autosize="{ minRows:1, maxRows:3 }" :disabled="true"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <tl-approval-history ref="history" sourceType="MpmProjectTaskFeedback" :sourceId="model.id" />
    <div slot="footer" class="dialog-footer">
      <el-button :type="disableEditSubmit === false ? 'text' : 'primary'" @click="doCancelEdit">取消</el-button>
      <!-- <el-button type="primary" @click="doSubmitEdit" :loading="saveLoading" v-if="!disableEditSubmit"
        :disabled="disableSave">
        <svg-icon icon-class="save" />保存
      </el-button>
      <el-button type="primary" @click="doSubmitApproval" :loading="submitLoading" v-if="!disableEditSubmit"
        :disabled="disableApproval">
        <svg-icon icon-class="send" />提交更新
      </el-button> -->
      <tl-attachment sourceType="MpmProjectTaskFeedback" :sourceId="model.id" :disabled="disableAttachment" :editable="true"></tl-attachment>
      <el-button type="primary" @click="$refs.history.visible = true" :disabled="disableApprovalHistory">
        <svg-icon icon-class="list" />审批历史
      </el-button>
      <el-button type="primary" @click="doDelApproval" :loading="delApprovalLoading" v-if="!disableEditSubmit" :disabled="disableDelApproval">
        <svg-icon icon-class="undo" />取消审批
      </el-button>
    </div>
  </tl-sub-page>
</template>

<script>
/** mixins */
import { mixin_approval_edit } from '@tapui/mixins/mixin_approval_edit'
import { validateNull } from '@tapui/utils/validate'
/** 子组件 */
/** 工具类 */
import { putAction, getAction, postAction, deleteAction } from '@tapui/utils/http'
/** VUE配置 */
export default {
  mixins: [mixin_approval_edit],
  components: {},
  data() {
    return {
      moduleTitle: '项目任务反馈',
      urlPrefix: '/mpm/projectTaskFeedback/',
      fromApproval: '',
      url: {
        // 额外的url
        queryTaskInfo: '/mpm/projectTask/list'
      },
      riskClassNames: ["low-level", "middle-level", "high-level"],
      isDmdTask: 0,
      documentDetail: []
    }
  },
  computed: {
    isFinish() {
      return this.model.taskschedule === 100
    },
    taskRiskClassName() {
      return this.model.taskrisk ? this.riskClassNames[Number.parseInt(this.model.taskrisk)] : ""
    },
    documentTaskUnfinish() {
      return !(this.documentDetail.indexOf('1') > -1 && this.documentDetail.indexOf('2') > -1 && this.documentDetail.indexOf('3') > -1 && this.documentDetail.indexOf('4') > -1 && this.documentDetail.indexOf('5') > -1) && this.isDmdTask === 3
    }
  },
  methods: {
    taskactualenddate(e) {
      var taskactualstartdate = new Date(this.model.taskactualstartdate).getTime()
      var taskactualenddate = new Date(this.model.taskactualenddate).getTime()
      var nowdate = new Date().getTime()
      // if (taskactualenddate > nowdate) {
      //   this.$tap.alert('任务实际完成日期不能晚于当前日期！', 'warning')
      //   this.model.taskactualenddate = null
      //   return
      // }
      // if (taskactualenddate < taskactualstartdate) {
      //   this.$tap.alert('任务实际完成日期不能早于任务实际开始日期！', 'warning')
      //   this.model.taskactualenddate = null
      //   return
      // }
      // 计划结束日期存储为选择日期的的23：59：59
      let date = new Date(taskactualenddate)
      let timeDate = ""
      let Y = date.getFullYear() + '-'
      let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
      let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '
      let h = 23 + ':'
      let m = 59 + ':'
      let s = 59
      timeDate = Y + M + D + h + m + s
      this.$set(this.model, 'taskactualenddate', timeDate)
    },
    changetaskschedule() {
      if (this.model.taskschedule === 100) {
        if (this.model.havenamelist === '0') {
          this.$set(this.model, 'istaskcomplete', '0')
          this.$set(this.model, 'taskstate', '3')
        }
        if (this.documentTaskUnfinish) {
          this.$set(this.model, 'istaskcomplete', '0')
          this.$set(this.model, 'taskstate', '3')
        }
      } else {
        this.$set(this.model, 'taskstate', '1')
        this.$set(this.model, 'istaskcomplete', null)
        this.$set(this.model, 'taskactualenddate', null)
      }
    },
    // 是否获取决策链名单的值发生变化
    changehavenamelist(data) {
      if (data === '0' && this.isFinish) {
        // 如果任务未完成
        this.$set(this.model, 'istaskcomplete', '0')
        this.$set(this.model, 'taskstate', '3')
      }
    },
    // 审查会文件内容的值发生变化
    changeReviewMeetingDocument(data) {
        if (this.documentTaskUnfinish && this.isFinish) {
          this.$set(this.model, 'istaskcomplete', '0')
          this.$set(this.model, 'taskstate', '3')
        }
    },
    // 是否完成任务的值发生变化
    changeistaskcomplete(data) {
      if (data === '1') {
        // 如果任务完成，则任务状态为已完成
        this.$set(this.model, 'taskstate', '2')
      } else if (data === '0') {
        // 如果任务未完成，则任务状态为未完成关闭
        this.$set(this.model, 'taskstate', '3')
      }
    },
    assignDefaultValue() {
      if (this.isAdd) {
        if (this.codeModel.flowidList && this.codeModel.flowidList.length > 0) {
          this.$set(this.model, 'flowid', parseInt(this.codeModel.flowidList[0].id))
        }
        this.$set(this.model, 'applyorgcode', this.org.code)
        this.$set(this.model, 'applyorgname', this.org.name)
        this.$set(this.model, 'applydeptcode', this.dept.code)
        this.$set(this.model, 'applydeptname', this.dept.fullname)
        this.$set(this.model, 'applyusercode', this.user.code)
        this.$set(this.model, 'applyusername', this.user.name)
        this.$set(this.model, 'usercode', this.user.code)
        this.$set(this.model, 'username', this.user.name)
        this.$set(this.model, 'deptcode', this.dept.code)
        this.$set(this.model, 'orgcode', this.org.code)
        this.$set(this.model, 'feedbackdate', new Date())
        this.$set(this.model, 'taskid', this.taskid)
        this.$set(this.model, 'taskname', this.taskname)
        this.$set(this.model, 'taskschedule', this.taskschedule)
        this.$set(this.model, 'taskstate', this.taskstate)
      }
    },
    loaded() {
      validateNull(this.model.reviewmeetingdocument) ? this.$set(this, 'documentDetail', []) : this.$set(this, 'documentDetail', this.model.reviewmeetingdocument.split(','))
      // 页面加载完毕执行
      if (!this.isAdd && this.model.docno) {
        this.title = this.title + `（单据编号：${this.model.docno}）`
      }
      getAction(this.url.queryTaskInfo, { qry_taskid: this.model.taskid }).then((res) => {
        if (res.success && res.result.dataList.length > 0) {
          this.$set(this.model, 'taskupdatefre', res.result.dataList[0].taskupdatefre)
          this.isDmdTask = res.result.dataList[0].dmdtask
        } else {
          this.$tap.alert(res.message, 'warning')
        }
      })
    },
    /** 提交审批 */
    doSubmitApproval() {
      this.$refs.form.validate(valid => {
        if (valid) {
          if (this.model.taskstate === '0') {
            this.$tap.alert('任务已开始，请选择正确的任务状态!', 'warning')
            return
          }
          if (!this.url.submit) {
            this.$tap.alert('请设置审批地址!', 'warning')
            return
          }
          if (!this.beforeApproval()) {
            return
          }
          this.submitLoading = true
          this.$tap
            .confirm('确定提交审批吗？提交后，单据内容不可修改！')
            .then(_ => {
              putAction(this.url.submit, this.model).then(res => {
                if (res.success) {
                  this.$tap.message(res.message, 'success')
                  this.queryData(this.model.id)
                  this.afterApproval()
                } else {
                  this.$tap.alert(res.message, 'warning')
                }
                this.submitLoading = false
              })
            })
            .catch(_ => {
              this.submitLoading = false
            })
        }
      })
    },
    doCancelEdit() {
      this.visible = false
      this.$emit('close')
      this.$emit('refresh')
    },
    saveCourierInfo(resolve, reject) {
      this.$set(this.model, 'feedbackdate', new Date())
      if (Array.isArray(this.documentDetail)) {
        this.$set(this.model, 'reviewmeetingdocument', this.documentDetail.join(','))
      }
      putAction(this.url.edit, this.model)
        .then(res => {
          if (res.success) {
            resolve()
          } else {
            this.$tap.alert(res.message, 'warning')
            reject()
          }
        })
        .catch(err => {
          this.$tap.alert('保存任务反馈信息失败，请联系系统管理员', 'warning')
          reject()
        })
    },
    beforeSubmit() {
      if (Array.isArray(this.documentDetail)) {
        this.$set(this.model, 'reviewmeetingdocument', this.documentDetail.join(','))
      }
      return true
    }
  }
}
</script>
<style lang="scss" scoped>

$riskLevels: high-level, middle-level, low-level;
$riskColors: #ff6363, #ffe119, #bfef45;
//for 循环 根据风险中高 匹配颜色和字体样式
@for $i from 1 through 3 {
  .#{nth($riskLevels,$i)} /deep/ .el-input__inner {
    background-color: nth($riskColors, $i) !important;
    color: rgba(27, 27, 27, 0.5) !important;
    font-weight: 600;
  }
}
</style>
